<template>

  <BaseTable :data="doctorData.rows" :columns="columns" :total="doctorData.total" v-model:page-Data="pageData">
    <!-- 头像的插槽 -->
    <template #avatar="scope">
      <el-image :src="scope.row.avatar" style="width: 30px;height: 30px;"></el-image>
    </template>
    <!-- 角色 -->
    <template #roleId="{ row }">
      {{ row.roleId?.name }}
    </template>
    <!-- 所属团队 -->
    <template #teamIds="{ row }">
      {{row.teamIds.map(item => item.name).join('')}}
    </template>
    <!-- 状态 -->
    <template #is_del="{ row }">
      <el-switch v-model="row.is_del" class="mb-2" :active-value="1" :inactive-value="0" active-text="启用"
        inactive-text="禁用" inline-prompt />
    </template>
    <!-- 所属机构 -->
    <template #organizationId="{ row }">
      {{ row.organizationId?.name }}
    </template>
    <!-- 操作 -->
    <template #action="{ row }">
      <el-button type="primary" link @click="toDetails(row._id)">查看详情</el-button>
      <el-button type="primary" link>发消息</el-button>
      <el-button type="primary" link @click="toUpdate(row._id)">编辑</el-button>
      <el-button type="danger" link @click="onDelete(row._id)">删除</el-button>
    </template>
    <!-- 页码 -->
  </BaseTable>

</template>

<script setup>
import { onMounted, ref, watch } from 'vue';
import { useFindData } from '../../composables/findData';
import BaseTable from '../../components/base-table/BaseTable.vue';
import { useRouter } from 'vue-router';
import { removeDoctorsApi } from '../../api/doctors';
const pageData = ref({
  currentPage: 1,
  pageSize: 5,
})
const router = useRouter()
defineProps(['columns'])
const emit = defineEmits(['findDoctorDataAsync'])
const { doctorData, findDoctorDataAsync } = useFindData()

onMounted(() => {

  findDoctorDataAsync(pageData.value)
})

watch(pageData, () => {
  console.log(pageData.value);

  findDoctorDataAsync({ ...pageData.value })
}, { deep: true })

const toUpdate = (_id) => {
  router.push(`/data/doctor/update/${_id}`)
}
const toDetails = (_id) => {
  router.push(`/data/doctor/detail/${_id}`)
}

// 删除的请求
const ondelete = (_id) => {
  removeDoctorsApi(_id).then(res => {
    if (res.code == 200) {
      ElMessage({
        type: 'success',
        message: '删除成功',
      })
      findDoctorDataAsync()
    }
  })
}
// 删除的弹窗
const onDelete = (_id) => {
  ElMessageBox.confirm(
    '确定要删除医生信息吗？',
    '提示',
    {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
    }
  ).then(() => {
    ondelete({ _id })
    findDoctorDataAsync()
  }).catch(() => {
  })
}
</script>

<style scoped></style>